import router, { constantRoutes, asyncRouters } from '@/router'
// 数据
const state = () => {
  return {
    // 默认合并静态路由
    allRoute: constantRoutes
  }
}
// 修改数据的方法，同步
const mutations = {
  setRoutes(state, newRouters) {
    state.allRoute = newRouters
  }
}
const actions = {
  filterRoutes(context) {
    // 获取用户可以访问的menus
    const menus = context.rootState.user.userInfo.roles.menus
    // 和动态的路由去比较
    const newRoutes = asyncRouters.filter(v => {
      // 筛选children 并赋值给children属性
      const _length = v.children.filter(child => {
        // 是否存在的结果返回
        // 存在true不存在false
        return menus.includes(child.name)
      }).length
      // 到这children筛选完毕了是筛选之后的值
      // children的长度为0
      return _length > 0
    })
    newRoutes.push({ path: '*', redirect: '/404', hidden: true })
    // addRoutes 动态添加
    router.addRoutes(newRoutes)
    // 合并到vuex默认的数组中
    // 静态路由和动态生成的新路由合并并赋值
    context.commit('setRoutes', [...constantRoutes, ...newRoutes])
  }
}

export default {
  namespaced: true, // 开启命名空间 并暴露
  state,
  mutations,
  actions
}
